<template>
	<view class="g-info-list">
		<view class="item" v-for="(i,index) in list" @tap="detail(i)" :key="index">
			 <!-- :class="(index+1)%2===0?'nmr':''" ../../static/52.png-->
			<image class="img" lazy-load :lazy-load-margin="0" :src="i.goodsImages"></image>
			<view class="desc">
				<view class="name">
					{{i.productName}}
				</view>
				<view class="price">
					¥{{i.price}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {getGoodsList} from '@/api/goods.js'
	export default {
		data() {
			return {
				list: [],
				def: {}
			};
		},
		onLoad(ops) {
			console.log(ops,'goodsInfoList')
			this.def = ops
			this.getList()
		},
		methods:{
			getList(){
				getGoodsList().then((res) =>{
					this.list =  res
				})
			},
			detail(i){
				uni.setStorageSync('cartListData',[]) 
				uni.navigateTo({
					url: '/pagesA/goods/goodsDetail?id='+i.id + '&orderOrigin=' + this.def.orderOrigin + '&showId=' + this.def.showId + '&subjectId=' + this.def.subjectId
				})
			}
		}
	}
</script>

<style lang="less" scoped>
.g-info-list{
	// margin: 0 32rpx;
	margin-left: 21rpx;
	padding-top: 32rpx;
	.item{
		width: 330rpx;
		height: 400rpx;
		border-radius: 40rpx;
		background: #FFFFFF;
		font-size: 28rpx;
		color: #333;
		margin: 0 13rpx;
		margin-bottom: 32rpx;
		display: inline-block;
		.img{
			width: 330rpx;
			height: 248rpx;
			border-radius: 40rpx 40rpx 0px 0px;
		}
		.desc{
			margin: 0 16rpx;
			margin-top: 10rpx;
			.name{
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 1;
				word-wrap: break-word;
				-webkit-hyphens: auto;
				hyphens: auto;
			}
		}
		.price{
			color: #E4919D;
			font-size: 32rpx;
			margin-top: 24rpx;
		}
	}
	.nmr{
		margin-right: 0;
	}
}
</style>
